<template>
    姓名：<input v-model="userName"/>{{userName }}<br/>
    薪水：<input type="number" v-model="salary"/>{{ salary }}<br/>
    <button v-on:click="addSalary">提交</button>
</template>

<script lang="ts">
// 向外暴露这个组件
    export default {
        // 名字可以不写，不写就默认用文件名
        name:"SalaryInfo"
    }
</script>

<script setup lang="ts">
import { ref } from 'vue';

let userName = ref('roy')
let salary=ref(15000)
function addSalary() {
    salary.value+=1000
}
// 向父容器暴漏，需要写defineExpose，里面具体写要暴漏哪些
defineExpose({userName,salary})
</script>

<style>

</style>